<script lang="ts" setup>
import { ref } from 'vue';
import { Page } from '@vben/common-ui';
import loginTitle from "#/assets/login-title.png"
import loginBg from '#/assets/login-bg.png'

defineOptions({ name: 'AuthLayout' });
// const url = 'https://fastly.picsum.photos/id/44/1920/1080.jpg?hmac=TSHxKeA6g7EcxNit0Eyh5NEDX9Y4pcQVqlDByliJJsg'
let bgImage = ref('')
bgImage.value = loginBg

</script>
<template>
  <Page class="h-full">
    <div class="flex h-full flex-col">
      <div class="auth-title flex items-center h-[80px]">
        <img :src="loginTitle" alt="" class="">
        <span class="font-bold text-2xl">国家工业软件产教融合共同体</span>
      </div>
      <div class="login bg-cover bg-center h-full flex-auto flex items-center justify-end h-auto" 
      :style="{ backgroundImage: `url(${bgImage})` }">

        <RouterView v-slot="{ Component, route }">
            <component :is="Component" class="border-indigo-500 bg-[#fff] mr-[80px] p-[50px] rounded-[6px]"/>
        </RouterView>
        
      </div>
    </div>
  </Page>
</template>
<style lang="less" scoped>
</style>
